<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta content="width=device-width,initial-scale=1.0,maximum-scale=1.0,user-scalable=0" name="viewport">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>一朵 - 会员登录</title>
  <!-- 阿里巴巴矢量图库 -->
    <link rel="stylesheet" href="http://at.alicdn.com/t/font_561814_q1vg409ad6coko6r.css">
  <!-- 大于1200 -->
    <link rel="stylesheet" media="screen and (min-width: 1200px)" href="__STATIC__/index/css/login/login1200.css" />
  <!-- 1080-1200 -->
    <link rel="stylesheet" media="screen  and (min-width: 959px) and (max-width: 1199px) " href="__STATIC__/index/css/login/login1200.css"
    />
  <!-- 768-959 -->
    <link rel="stylesheet" media="screen  and (min-width: 768px) and (max-width: 959px) " href="__STATIC__/index/css/login/login768.css"
    />
  <!-- 568-767 -->
    <link rel="stylesheet" media="screen  and (min-width: 568px) and (max-width: 767px) " href="__STATIC__/index/css/login/login568.css"
    />
  <!-- 375-567 -->
    <link rel="stylesheet" type="text/css" media="screen  and (min-width: 375px) and (max-width: 567px) " href="__STATIC__/index/css/login/login375.css"
    />
  <!-- 小于375-->
    <link rel="stylesheet" type="text/css" media="screen  and (max-width: 374px) " href="__STATIC__/index/css/login/login320.css" />
  <!-- jquery-3.2.1引用 -->
    <script src="__STATIC__/index/js/global/jquery-3.2.1.min.js"></script>
  <!--引入layer-->
    <script src="__STATIC__/layer/layer.js" ></script>

</head>

<body>
    <div class="PC">
        <div>
            <div>
                <a href="{:url('Index/index')}">返回</a>
                <a href="javascript:;">{$city.value}</a>
            </div>
            <div>
                <div>
                    <img src="__STATIC__/index/img/login/pc_logo.png" alt="">
                </div>
                <div class="pc-user">
                    <input type="text" placeholder="请输入手机号" name="mobile" value="{$login_mobile}" onkeyup="get_mobile(this)">
                </div>
                <div class="pc-password">
                    <input type="password" placeholder="请输入密码" name="password" value="{$login_pass}" onkeyup="get_password(this);">
                </div>
                <div class="pc-forget">
                    <div>
                        <input type="checkbox" name="remember" id="pc-jizhu" value="1" {if condition="$remember eq 1"} checked {/if} onchange="get_default(this)">
                        <label for="pc-jizhu">记住账号</label>
                    </div>
                    <div>
                        <a href="{:url('Login/find_password')}">忘记密码</a>
                    </div>
                </div>

                <a href="javascript:;" class="pc-button" onclick="checkform();">登录</a>
                <a href="{:url('Login/register')}" class="pc-register">--注册--</a>
            </div>
        </div>
    </div>
    <div class="M">
        <div>
            <div>
                <a href="{:url('Index/index')}">
                    <span class="iconfont icon-xiangzuo"></span>首页</a>
                登录
            </div>
            <div>
                <div>
                    <img src="__STATIC__/index/img/login/m_logo.png" alt="">
                </div>
                <div class="m-user">
                    <input type="text" placeholder="请输入手机号" name="m_mobile" onkeyup="get_mobile(this)">
                </div>
                <div class="m-password">
                    <input type="password" placeholder="请输入密码" name="m_password" onkeyup="get_password(this)">
                </div>
                <div class="m-forget">
                    <div>
                        <input type="checkbox" name="m_remember" value="1" id="m-jizhu" {if condition="$remember eq 1"} checked {/if} onchange="get_default(this)" >
                        <label for="m-jizhu">记住账号</label>
                    </div>
                    <div>
                        <a href="{:url('Login/find_password')}">忘记密码</a>
                    </div>
                </div>

                <a href="javascript:;" class="m-button" onclick="m_checkform();">登录</a>
                <a href="{:url('Login/register')}" class="m-register">注册</a>
            </div>
        </div>
    </div>
</body>

</html>
<script>
    /**
     * PC端 -- 检查提交的表单信息
     */
    function checkform(){
        var reg = /^1[34578]\d{9}$/;
        var mobile = $('input[name=mobile]').val();
        var password = $('input[name=password]').val();
//        var remember = $('input[name=remember]:checked').val();
        if(mobile == ''){
            layer.msg('请输入手机号',{icon:2,time:1500,shade: 0.1}, function(index){
                layer.close(index);
            });
            return false;
        }
        if(!reg.test(mobile)){
            layer.msg('手机格式错误，请重新调填写',{icon:2,time:1500,shade: 0.1}, function(index){
                layer.close(index);
            });
            return false;
        }
        if(password == ''){
            layer.msg('请输入登录密码',{icon:2,time:1500,shade: 0.1}, function(index){
                layer.close(index);
            });
            return false;
        }

        if($('input[name=remember]').hasClass('remember')){
            var remember = 1;
        }else{
            var remember = 0;
        }

        $.post("{:url('Login/loginin')}",
            {mobile:mobile,password:password,remember:remember},
            function(data){
                if(data.code == 1){
                    layer.msg('登录成功',{icon:1,time:1500,shade: 0.1}, function(index){
                        layer.close(index);
                        window.location.href = "{:Url('Index/index')}";

                    });
                }else{
                    layer.msg(data.msg,{icon:2,time:1500,shade: 0.1}, function(index){
                        layer.close(index);
                    });
//                    window.location.href = "{$url}";
                }
            }
        );
    }

    /**
     * 移动端 -- 检查提交的表单信息
     */
    function m_checkform(){
        var reg = /^1[34578]\d{9}$/;
        var mobile = $('input[name=m_mobile]').val();
        var password = $('input[name=m_password]').val();
//        var remember = $('input[name=m_remember]:checked').val();
        if($('input[name=m_remember]').hasClass('remember')){
            var remember = 1;
        }else{
            var remember = 0;
        }
        if(mobile == ''){
            layer.msg('请输入手机号',{icon:2,time:1500,shade: 0.1}, function(index){
                layer.close(index);
            });
            return false;
        }
        if(!reg.test(mobile)){
            layer.msg('手机格式错误，请重新调填写',{icon:2,time:1500,shade: 0.1}, function(index){
                layer.close(index);
            });
            return false;
        }
        if(password == ''){
            layer.msg('请输入登录密码',{icon:2,time:1500,shade: 0.1}, function(index){
                layer.close(index);
            });
            return false;
        }
        $.post("{:url('Login/loginin')}",
            {mobile:mobile,password:password,remember:remember},
            function(data){
                if(data.code == 1){
                    layer.msg('登录成功',{icon:1,time:1500,shade: 0.1}, function(index){
                        layer.close(index);
                        window.location.href = "{:url('Index/index')}";
                    });
                }else{
                    layer.msg(data.msg,{icon:2,time:1500,shade: 0.1}, function(index){
                        layer.close(index);
                    });
//                    window.location.href = "{$url}";
                }
            }
        );
    }
    /**
     * 积分
     */
    function get_mobile(obj){
        var value = $(obj).val();
        $('input[name=mobile]').val(value);
        $('input[name=m_mobile]').val(value);
    }

    /**
     * 获得密码
     * @param obj
     */
    function get_password(obj){
        var value = $(obj).val();
        $('input[name=password]').val(value);
        $('input[name=m_password]').val(value);
    }

    /**
     * 记住密码
     */
    function get_default(obj){
        if($(obj).hasClass('remember')){
            $('input[name=m_remember]').removeClass('remember');
            $('input[name=remember]').removeClass('remember');
        }else{
            $('input[name=m_remember]').addClass('remember');
            $('input[name=remember]').addClass('remember');
        }
    }

</script>